var tree = new Ext.tree.AsyncTreeNode({
                            text:'Online',                            
                            children:[{
                                text:'Friends',
                                expanded:true,                                
                                children:[{
                                	id:1,
                                    text:'Brian',
                                    iconCls:'user',
                                    leaf:true                                 
                                },{
                                    text:'Jon',
                                    iconCls:'user',
                                    leaf:true
                                },{
                                    text:'Tim',
                                    iconCls:'user',
                                    leaf:true
                                },{
                                    text:'Nige',
                                    iconCls:'user',
                                    leaf:true
                                },{
                                    text:'Fred',
                                    iconCls:'user',
                                    leaf:true
                                },{
                                    text:'Bob',
                                    iconCls:'user',
                                    leaf:true
                                }]
                            },{
                                text:'Family',
                                expanded:true,
                                children:[{
                                    text:'Kelly',
                                    iconCls:'user-girl',
                                    leaf:true
                                },{
                                    text:'Sara',
                                    iconCls:'user-girl',
                                    leaf:true
                                },{
                                    text:'Zack',
                                    iconCls:'user-kid',
                                    leaf:true
                                },{
                                    text:'John',
                                    iconCls:'user-kid',
                                    leaf:true
                                }]
                            }]
                        });
   
               
                    

//页面初始化
Ext.onReady(function(){

    var chatWin;
    var openChatBtn = Ext.get('openChatBtn');    
    

    openChatBtn.on('click', function(){        
        if(!chatWin){  
        	//聊天窗口        
	        var chatTabs = new Ext.TabPanel({
	            region: 'center',
	            margins:'0 5 5 0',
	            activeTab: 0,
	            defaults:{autoScroll:true},
	            enableTabScroll:true,		            
	            items:{
	            	id:'main-view',                    
                    title:'说明', 
                    html:"双击用户进行聊天"                   
	            }    
	        });	
	        //用户面板
	        var userTreePanel = new Ext.tree.TreePanel({
                        id:'im-tree',
                        title: '在线用户',
                        loader: new Ext.tree.TreeLoader(),
                        rootVisible:false,
                        lines:false,
                        autoScroll:true,
                        region: 'west',
			            split: true,
			            width: 200,
			            collapsible: true,	
			            		           
                        tools:[{
                            id:'refresh',
                            on:{
                                click: function(){
                                    var tree = Ext.getCmp('im-tree');
                                    tree.body.mask('Loading', 'x-mask-loading');
                                    tree.root.reload();
                                    tree.root.collapse(true, false);
                                    setTimeout(function(){ // mimic a server call
                                        tree.body.unmask();
                                        tree.root.expand(true, true);
                                    }, 1000);
                                }
                            }
                        }],
                        root: tree
                    });                    
            userTreePanel.on("dblclick",function(node){            	
            	if(node.leaf)
            	{	
            		addTab(chatTabs,node.text);  
            	}          	
            });        //树节点的单击事件只能放到TreePanel上
	
	        chatWin = new Ext.Window({
	            title: 'ajax聊天',
	            closeAction:'hide',
	            width:800,
	            height:500,	            
	            plain:true,
	            layout: 'border',	
	            items: [userTreePanel, chatTabs]
	        });		        
        }
        chatWin.show(this); 
    });    
});




/**
 * 增加一个聊天TAB
 */
function addTab(chatTabs,userName)
{
   chatTabs.add({
       title: userName,       
       layout:'border',             
       closable:true ,
       items:[{                
                region:'center' 
               },
               {
                  region:'south',
                  height:150,
                  split:true,
                  buttonAlign:"right",                  
                  bbar:[
                  {
                     text:'发送',         
                     handler:function(){alert('Not implemented.');}
                  },
                  {
                     text:'清空',         
                     handler:function(){alert('Not implemented.');}
                  }
                  ]
                }
              ]
   }).show();
   //需要设置输入框的大小
  
}


 
                         
